<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Git pages</title>
    <link rel="stylesheet" href="/asset/bulma.min-82aac43507618108.css">
    <link rel="stylesheet" href="/asset/fontawesome.min-5e9e696c59c57e83.css">
    <link rel="stylesheet" href="/asset/regular.min-a0c258fb7c5f655d.css">
    <link rel="stylesheet" href="/asset/solid.min-70c2e5caa950974d.css">
    <script type="application/javascript">
        function newRepository(t) {
            const clazzName = t.className;
            t.disabled = true;
            t.className = clazzName + ' is-loading';
            let formBody = [];
            formBody.push("url=" + encodeURIComponent(document.getElementById('url').value));
            formBody.push("user=" + encodeURIComponent(document.getElementById('user').value));
            formBody.push("email=" + encodeURIComponent(document.getElementById('email').value));
            const options = {
                method: 'POST',
                body: formBody.join("&"),
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
                }
            };
            fetch('/git/new', options).then(response => response.json())
                .then(data => {
                    t.className = clazzName;
                    t.disabled = false;
                    console.log(data);
                    if (data.status === 0) {
                        location.href = 'git-pages';
                    } else {
                        document.getElementById('errorMessage').innerHTML = data.error.detail;
                        document.getElementById('notification').style.display = 'block';
                    }
                })
                .catch(err => {
                    console.log(err);
                });
        }
        document.addEventListener('DOMContentLoaded', () => {
            (document.querySelectorAll('.notification .delete') || []).forEach(($delete) => {
                const $notification = $delete.parentNode;

                $delete.addEventListener('click', () => {
                    $notification.style.display = 'none';
                });
            });
        });
    </script>
</head>
<body>
<div class="container">
    <h1 class="title">
        信息配置/Settings
    </h1>
    <p>&nbsp;</p>
    <div class="field">
        <label class="label">仓库地址/Git repository URL</label>
        <div class="control is-medium has-icons-left has-icons-right">
            <input class="input" type="text" placeholder="" id="url" value=""/>
            <span class="icon is-small is-left">
              <i class="fas fa-lock"></i>
            </span>
        </div>
        <p class="help">帮助/Help.</p>
    </div>
    <div class="field">
        <label class="label">邮箱/Email</label>
        <div class="control is-medium has-icons-left has-icons-right">
            <input class="input" type="email" placeholder="" id="email" value=""/>
            <span class="icon is-small is-left">
              <i class="fas fa-lock"></i>
            </span>
        </div>
        <p class="help">For git config: 'user.email'.</p>
    </div>
    <div class="field">
        <label class="label">用户名/UserName</label>
        <div class="control is-medium has-icons-left has-icons-right">
            <input class="input" type="text" placeholder="" id="user" value=""/>
            <span class="icon is-small is-left">
              <i class="fas fa-lock"></i>
            </span>
        </div>
        <p class="help">For git config: 'user.name'.</p>
    </div>
    <div>
        <button class="button is-medium" onclick="newRepository(this);">克隆/Clone</button>
        <button class="button is-medium" onclick="location.href='/management';">返回/Back</button>
    </div>
    <div id="notification" class="notification is-danger is-light" style="display:none;width:435px">
        <button class="delete"></button>
        <span id="errorMessage"></span>
    </div>
</div>
</body>
</html>